<template>
  <div class="common-left-bg">
    <dv-border-box-7>
        <div class="common-title">校园圈情况</div>
        <el-row :gutter="20">
          <el-col :span="8" class="qingkuang">
            家长发布<br />
            56%
          </el-col>
          <el-col :span="8">
              <dv-water-level-pond :config="config" style="width:100px;height:100px; margin: 10px auto;" />

          </el-col>
          <el-col :span="8" class="qingkuang">
            老师发布<br />
            56%
          </el-col>
        </el-row>

        <el-row :gutter="20" >
          <el-col :span="12" class="qingkuangx">
            <span style="color:red"><i class="el-icon-star-on" ></i></span>累计点赞数:3120
          </el-col>
          <el-col :span="12" class="qingkuangx">
            <span style="color:green"><i class="el-icon-s-comment" ></i></span>累计评论数：2000
          </el-col>
        </el-row>
    </dv-border-box-7>
  </div>
</template>

<script>
export default {
  name: 'xiaoyuanquanqingkuang',
  data () {
    return {
      config: {
        data: [55],
        shape: 'round'
      }
    }
  }
};
</script>

<style lang="less">
.qingkuang{  text-align: center; margin-top: 30px;color: #19c3eb; }
.qingkuangx{color: #19c3eb; text-align: center;  font-size: 14px; margin-top:20px; height:40px;}
.qingkuangx spam{ font-size: 14px;}
</style>
